import React from 'react';
import { inject, observer } from 'mobx-react';
import VConsole from 'vconsole';
import Router from './router';
import ReturnTop from './components/returnTop';
import { clog, getPlatform, getIosVersion } from './utils/util';
import './App.less';

if (process.env.REACT_APP_ENV === 'dev') {
  const vConsole = new VConsole();
  clog('vConsole', vConsole);
}
function App(props: any) {
  clog('App props', props);
  clog('getPlatform', getPlatform());
  clog('getIosVersion', getIosVersion());
  return (
    <div className='app'>
      <ReturnTop />
      <Router />
    </div>
  );
}
export default inject('languageStore', 'rtlStore')(observer(App));
/*
1使用 mobx-react 将 store传递给子组件
（1） 在 index.tsx中 引入store和 从mobx中引入Provider，用Provider将组间包裹
   import store from './store';
   import { Provider } from 'mobx-react';
   ReactDOM.render(
    <Provider {...store}>
        <App />
    </Provider>,
    document.getElementById('root')
   );
（2） 在app.index中引用
    import { inject, observer, } from 'mobx-react'
    然后  用inject 劫持要使用的store里的属性（劫持全局应用的属性）
    export default inject('languageStore', 'rtlStore')(observer(App));
    在函数中使用
   console.log("App props", props);props是传递给组间的参数，其参数里里就有languageStore和rtlStore
   使用observer  是对store里的数据发生变化时，页面上的数据和UI相应的做出改变
(3)react  只有在页面上的数据发生改变时，才会引起页面的重新加载，
    所以要在app.tsx上展示一下store的数据，如无需要，可将其style设置为 display：‘none’
*/
